<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 监听数组的方法
        // 1. 源码位置 src/util/lang.js  ->  def 方法
        function def (obj, key, val, enumerable) {
            Object.defineProperty(obj, key, {
                value: val,
                enumerable: !!enumerable,
                writable: true,
                configurable: true
            })
        }
        const arrayProto = Array.prototype
        const arrayMethods = Object.create(arrayProto)

        const methodsToPatch = [
        'push',
        'pop',
        'shift',
        'unshift',
        'splice',
        'sort',
        'reverse'
        ]

        methodsToPatch.forEach(function (method) {
          const original = arrayProto[method]
          def(arrayMethods, method, function mutator (...args) {
            const result = original.apply(this, args)
            const ob = this.__ob__
            console.log(ob);
          })
        })
        let arr = [1, 2, 3 , 4 , 5]
        Object.setPrototypeOf(arr, arrayMethods)
        arr.push(1)
    </script>
</body>
</html>